<template>
  <div class="home-container">
    <common-header
      :user-name="userName"
      :current-component="currentComponent"
      @component-change="handleComponentChange"
      @logout="handleLogout"
    />
    
    <!-- 其他内容 -->
    <component :is="currentComponent"></component>
    
    <common-footer />
  </div>
</template>

<script>
import CommonHeader from '@/components/CommonHeader.vue'
import CommonFooter from '@/components/CommonFooter.vue'

export default {
  name: 'HomeView',
  components: {
    CommonHeader,
    CommonFooter
  },
  data() {
    return {
      userName: '用户名', // 从用户状态或API获取
      currentComponent: 'HomeBanner'
    }
  },
  methods: {
    handleComponentChange(item) {
      this.currentComponent = item.component
    },
    handleLogout() {
      // 处理登出逻辑
      this.$confirm('确认退出登录吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // 执行登出操作
        this.$router.push('/login')
      }).catch(() => {})
    }
  }
}
</script>

<style lang="scss" scoped>
.home-container {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
</style>